<template>
  <!-- PhotoAlbumManage 相册列表 -->
  <PageContainer>
    <view class="container">
      <Tabs v-model="currentTab">
        <Header title="相册" :is-box-shadow="false">
          <TabNav tabBarColor="#3762E1" />
        </Header>
        <template v-for="v in tabDataList" :key="v.id">
          <TabsItem :name="v.name" :value="v.id"></TabsItem>
        </template>
      </Tabs>
      <Paglist
        v-model="dataList"
        :is-init-api="false"
        :parame="parame"
        @register="register"
        :is-show-loadmore="dataList.length > 1"
      >
        <template v-for="v in dataList" :key="v.id">
          <PhotoAlbumItem :item="v" />
        </template>
      </Paglist>
    </view>
  </PageContainer>
</template>

<script lang="ts" setup>
  /**  PhotoAlbumManage  相册列表 */
  import PageContainer from '@/components/PageContainer/index.vue';
  import { photoAlbumGroupList, photoAlbumList } from '@/api/photoAlbum';
  import type { PhotoAlbumGroupListResult, PhotoAlbumListResult } from '@/api/photoAlbum/types';
  import Header from '@/components/Header/index.vue';
  import { provide, reactive, ref, watch } from 'vue';
  import Tabs from '@/components/tabs/index.vue';
  import TabsItem from '@/components/tabs/item.vue';
  import TabNav from '@/components/tabs/nav.vue';
  import Paglist from '@/components/Paglist/index.vue';
  import { useConList } from '@/components/Paglist/useConList';
  import PhotoAlbumItem from '../components/photoAlbumItem.vue';
  import { onPageScroll, onShareAppMessage } from '@dcloudio/uni-app';
  import { useAppStoreWithOut } from '@/store/modules/app';
  import { useAppShare } from '@/hooks/core/useAppShare';

  const { setWxSharePath } = useAppShare();
  const { globalConfig } = useAppStoreWithOut();
  const currentTab = ref<number>();
  const tabDataList = ref<PhotoAlbumGroupListResult[]>([]);

  provide('api', (obj: any) => {
    return photoAlbumList(obj);
  });

  const dataList = ref<PhotoAlbumListResult[]>([]);
  const parame = reactive({
    belongId: 0,
  });

  const [register, { refresh }] = useConList();

  watch(currentTab, (val) => val && tabsChange(val));
  function tabsChange(id: number) {
    currentTab.value = id;
    parame.belongId = id;
    refresh && refresh();
  }

  async function getGroup() {
    const list = await photoAlbumGroupList();
    if (list.length) {
      tabDataList.value = list;
      currentTab.value = list[0].id;
      parame.belongId = currentTab.value;
    }
  }

  async function __int() {
    await getGroup();
  }

  __int();

  provide('tabIsShow', false);

  onPageScroll(() => {});

  onShareAppMessage(() => ({
    imageUrl: globalConfig?.comShareOptions.shareImg,
    path: setWxSharePath({ name: 'photoAlbumManage' }),
    title: '相册',
  }));
</script>

<style lang="scss" scoped></style>
